<style lang="less">
	@import url("../../assets/style/wode.less");
</style>

<template>
	<mxq-router-layout>
		<div class="wode">
			<Head slot="header" @headerClick="headerClick($event)" :isIconShow="isIconShow">
				<div slot="headerTitle">
					{{ userName }}
				</div>
			</Head>

			<!-- 登录人信息 开始 -->
			<div class="top_cont">
				<van-row>
					<van-col span="22" offset="1" class="item">
						<van-col class="con_r" span="20">
							<span class="tit">{{userName}}</span>
							<span class="name">{{userClass}}</span>
						</van-col>

						<van-col span="4">
							<img :src="userImage" alt="" class="adm">
						</van-col>

					</van-col>
				</van-row>
			</div>
			<!-- 登录人信息 结束 -->

			<van-cell-group>
				<van-cell>
					<template slot="title">
						<span class="van-cell-text">当前版本</span>
						<span class="van-cell-text text_right">1.0.1</span>
					</template>
				</van-cell>
				<van-cell is-link>
					<template slot="title">
						<span class="van-cell-text">意见反馈</span>
					</template>
				</van-cell>
				<van-cell>
					<template slot="title">
						<span class="van-cell-text">清除缓存</span>
						<span class="van-cell-text text_right">15KB</span>
					</template>
				</van-cell>
				<van-cell @click="loginOut" class="login_out_box">
					<template slot="title">
						<span class="van-cell-text login_out">退出登录</span>
					</template>
				</van-cell>
			</van-cell-group>
		</div>
	</mxq-router-layout>
</template>

<script>
	import touXiang from '../../assets/img/index/touxiang.png'
	import Head from '@/components/head'
	import bus from "../../libs/bus.js"
	import { callData, fileUrl } from '../../axios/axios';
	import { getSession } from '../../libs/cache'
	import { loginOut } from '../../libs/com'
	import {
		Row,
		Col,
		Cell,
		CellGroup,
		Dialog,
		Toast
	} from 'vant'

	export default {
		name: 'wode',
		components: {
			Head,
			[Row.name]: Row,
			[Col.name]: Col,
			[Cell.name]: Cell,
			[CellGroup.name]: CellGroup,
			[Dialog.name]: Dialog,
			[Toast.name]: Toast
		},
		props: {
			list: Array,
			tit1: String,
			tit2: String,
			tit3: String
		},
		data() {
			return {
				show: true,
				isIconShow: false,//是否显示左侧箭头图标
				userName: '我的',
				userClass: '河南工区',
				userImage: touXiang
			}
		},
		methods: {
			// 头部两侧按钮点击事件
			headerClick(e) {
				bus.$emit('actives', 2)
			},
			// 拿到用户信息
			getUserMeg() {
				let user = JSON.parse(getSession("userMeg"))
				this.userName = user.realname
				this.userClass = user.jobName + '-' + user.workType
				if(user.avatar) this.userImage = fileUrl(user.avatar)
				else this.userImage = touXiang
			},
			// 退出登录
			loginOut() {
				let _this = this
				Dialog.confirm({
					title: '提示',
					message: '是否要退出登录'
				}).then(() => {
					callData('/auth/authentication/logOut', 'delete', {}).then(res => {
						if(res.success) this.clearData()
					}, err => {
						this.clearData()
					})
				}).catch(() => {
					// on cancel
				});
			},
			clearData() {
				loginOut()
			}
		},
		mounted() {
			this.getUserMeg()
		}
	}
</script>